#order-detail{
  font-size: 15px;
  .border-box{
    padding-bottom: 50px;
    .order-item{
      .title{
        height:35px;
        line-height:35px;
        color:#888;
        padding:0 15px;
        font-size:14px;
        display: flex;
        align-items: center;
        justify-content: space-between;

        .type{
          color: #1aad19;
        }
      }
      .order-line {
        margin-bottom: 10px;
        background: #FFFFFF;
        font-size: 15px;

        .item-top {
          .indent {
            line-height: 35px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 15px;

            .order-num {
              white-space: nowrap;
              text-overflow: ellipsis;
              overflow: hidden;
              flex: 1;
              padding-right: 10px;

              span {
                font-weight: bold;
              }
            }
            .user{
              color: #959595;;
              i{
                color: #e73237;
                margin-right: 5px;
              }
            }
          }
        }
        .item-middle {
          .middle-item {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            padding: 10px 15px;
            color: #959595;

            .goods{
              display: flex;
              image {
                width: 70px;
                height: 70px;
                border: 1px solid #e5e5e5;
              }
              .text {
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                flex: 1;
                padding-left: 10px;
                overflow: hidden;

                .names {
                  font-size: 17px;
                  color: #000000;
                  -webkit-line-clamp:2;
                  -webkit-box-orient:vertical;
                  display:-webkit-box;
                  text-overflow: ellipsis;
                  overflow: hidden;
                  line-height: 22px;
                }
                .model{
                  display: flex;
                  align-items: center;
                  justify-content: space-between;
                  font-size: 12px;
                  .money{
                    color:#ee2b1d;
                  }
                  .num{
                    color: #959595;
                  }
                }
              }
            }
            .service{
              margin-top: 10px;
              color:#959595;
              font-size:13px;
              border-radius:3px;
              min-width:72px;
              text-align:center;
              padding:5px 15px;
              border:1px solid #959595;

            }

          }
        }
        .item-bottom {
          display: flex;
          align-items: center;
          justify-content: space-between;
          padding: 10px 15px;
          font-size: 15px;
          .guide{
            color: #959595;
            span{
              color: #000000;
            }
          }
          .all-money{
            span{
              color:#ee2b1d;
            }
          }
        }
      }

      .order-info{
        padding: 10px 15px;
        background: #FFFFFF;

        .info-item{
          display: flex;
          padding: 2px 0;
          .name{
            width:80px;
            color: #959595;
          }
          .text{
            flex: 1;
          }
        }
      }
      .down-box{
        display: flex;
        align-items: center;
        padding: 10px 15px;
        background: #FFFFFF;

        .img-box{
          overflow: visible;
          .img-item{
            position: relative;
            width: 72px;
            height: 72px;
            display: inline-block;
            margin-right: 20px;
            image{
              width: 100%;
              height: 100%;
            }
            icon{
              position: absolute;
              top:-7px;
              right:-7px;
            }
          }

        }
        .down{
          width: 72px;
          height: 72px;
          border: 1px solid #cccccc;
          text-align: center;
          line-height: 72px;
          overflow: hidden;

          i{
            font-size: 18px;
            color: #cccccc;
          }
        }
      }
    }
    .send{
      .logistics{
        background: #FFFFFF;
        display: flex;
        align-items: center;
        margin: 10px 0;
        padding:10px 15px;

        .text{
          width: 80px;
        }
        .input-box{
          position: relative;
          z-index: 0;
          flex: 1;
          display: flex;
          align-items: center;
          picker{
            width: 100%;
          }
          input{
            width: 100%;
          }
          i{
            color: #c8c8c8;;
          }
        }
      }
      .Waybill{
        background: #FFFFFF;
        padding: 10px 15px;

        input{
          position: relative;
          padding: 10px 0;
          z-index: 0;
        }
      }
    }
    .order-detail-info{
      padding: 10px 15px;
      font-size: 14px;
      margin-top: 10px;
      background: #FFFFFF;
      .item{
        display: flex;
        align-items: center;
        justify-content: space-between;

        .name{
          color: #8a8a8a;
          width: 80px;
          text-align: right;

          &.big{
            color: #000000;
            font-weight: bold;
          }
        }
        .big-money{
          color: #ed0000;
          font-weight: bold;
        }
      }
    }
  }

  .button-type{
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 18px;
    text-align: center;
    overflow: hidden;
    .type-submit{
      display: flex;
      align-items: center;

      .clone{

        width: 115px;
        color: #000000;
        background: #FFFFFF;
      }

      .pay{

        flex: 1;
        background: #1aad19;
        color: #FFFFFF;

        i{
          color: #FFFFFF;
        }
      }
    }
    .send{
      background: #1aad19;
      color: #FFFFFF;
    }
  }


  .pay-type{
    .mask{
      position:fixed;
      top:0;
      left:0;
      right:0;
      bottom:0;
      z-index:200;
      background-color:rgba(0, 0, 0, 0.4);
    }
    .type-box{
      background:#FFFFFF;
      position:fixed;
      z-index:210;
      width:85%;
      top:50%;
      left:50%;
      transform:translate(-50%, -50%);
      border-radius:3px;
      overflow:hidden;
      text-align:center;

      .title{
        padding: 10px 0;
        font-size: 18px;
      }
      .pay-item{
        display: flex;
        align-items: center;
        padding: 5px 15px;

        .left{
          flex: 1;
          display: flex;
          align-items: center;

          .iconfont{
            font-size: 40px;

            &.icon-zhifubao{
              color: #34b4fe;
            }
            &.icon-weixin{
              color: #67b247;
            }
            &.icon-xianjin{
              color: #f5a623;
            }
            &.icon-yinlianqia{
              color: #272636;
            }
          }
          .info-box{
            font-size: 14px;
            text-align: left;
            margin-left: 10px;
            .text{
              color: #9b9b9b;
              font-size: 12px;
            }
          }
        }
      }
      .buttom-box{
        display: flex;
        align-items: center;
        font-size: 14px;
        height: 60px;
        line-height: 60px;
        text-align: center;
        view{
          flex: 1;
          width: 0%;
        }
        .close{
          color:#9b9b9b;
        }
        .submit{
          color:#d70c18;
        }
      }
    }
  }
}